<template>
  <div style="margin-top: 50rem;">
    <div class="cardbox">
      <div class="cardlittle">
        <CardView v-for="(banners, index) in daitail" :key="banners.id" :banners="banners" :index="index" @click="$router.push({ path: '/caseinfoeditor',query:{id:banners.id} })"></CardView>
      </div>
    </div>
    <dianying v-for="(banners, index) in daitail" :key="banners.id" :banners="banners" :index="index"></dianying>
  </div>
</template>

<script setup>
import { ref } from "vue";
import axios from "@/api/thisaxios.js";
import CardView from "@/components/CardView.vue";
import dianying from "@/components/dianying.vue";

const getDetail = () => axios.get("https://apis.netstart.cn/maoyan/index/comingList?ci=1&limit=20", {});
const daitail = ref([]);

async function update() {
  const { data } = await getDetail();
  daitail.value = data.coming;
  // console.log("daitail", daitail);
  return daitail;
}
update();

</script>

<style lang="scss" scoped>
.cardbox::-webkit-scrollbar {
  display: none;
}
.cardbox {
  width: 95vw;
  height: 160px;
  display: flex;
  margin: 10rem auto 0;
  background-color: #fff;
  text-align: center;
  overflow: auto;
  .cardlittle {
    display: flex;
  }
}
</style>
